<template>
    <el-table v-adaptive="30" :border="true" :data="applyList" :header-cell-style="$headerCellStyle" :stripe="true"
              default-expand-all
              highlight-current-row>
        <el-table-column fixed="left" label="" type="expand" width="47">
            <template #default="props">
                <div m="4">
                    <el-table :border="true" :data="props.row.outpFeesDetailVoList"
                              :header-cell-style="$headerCellStyle"
                              :stripe="true"
                              class="son-table-ml">
                        <el-table-column :align="'center'" :show-overflow-tooltip="true" label="明细" prop=""
                                         width="50">
                            <template #default="scope">
                                {{ scope.$index + 1 }}
                            </template>
                        </el-table-column>
                        <el-table-column :align="'center'" :show-overflow-tooltip="true" label="诊疗项目名称"
                                         prop="packItemName"
                                         width="147">
                            <template #default="scope">
                                <span class="ys-css">{{ scope.row.packItemName }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column :align="'center'" label="缴费标志" prop="chargeFlag" width="110">
                            <template #default="scope">
                                <dict-data-tag :options="dictDataMap['charge_flag_dict']"
                                               :value="scope.row.chargeFlag"/>
                            </template>
                        </el-table-column>
                        <el-table-column :align="'center'" :show-overflow-tooltip="true" label="发放确认标志" prop="confirmFlag"
                                         width="100">
                            <template #default="scope">
                                <dict-data-tag v-if="scope.row.itemClass==='A' || scope.row.itemClass==='B'"
                                               :options="dictDataMap['grant_flag']" :value="scope.row.confirmFlag"/>
                                <dict-data-tag v-else :options="dictDataMap['confirm_flag']"
                                               :value="scope.row.confirmFlag"/>
                            </template>
                        </el-table-column>
                        <!--                        <el-table-column :align="'center'" label="单价" prop="price" width="100">-->
                        <!--                            <template #default="scope">-->
                        <!--                                <span class="ys-css">{{ parseFloat(scope.row.price).toFixed(2) }}</span>元-->
                        <!--                            </template>-->
                        <!--                        </el-table-column>-->
                        <!--                        <el-table-column :align="'center'" label="数量" prop="num" width="60"/>-->
                        <el-table-column :align="'center'" label="总价" prop="charges" width="100">
                            <template #default="scope">
                                <span class="ys-css">{{ parseFloat(scope.row.charges).toFixed(2) }}</span>元
                            </template>
                        </el-table-column>
                        <el-table-column :align="'center'" class-name="small-padding fixed-width" fixed="left"
                                         label="操作"
                                         width="50">
                            <template #default="scope">
                                <!-- || scope.row.chargeFlag === '7' -->
                                <template v-if="scope.row.chargeFlag === '2' && !rowInfo.refundedPerson
                                         ">
                                    <el-tooltip class="item" content="退费申请(单个项目)" effect="dark"
                                                placement="left">
                                        <el-button circle type="warning"
                                                   @click="refundApplicationFun(scope.row.applyItemId, '3', 'single')">
                                            <svg-icon icon-class="refundApplication"/>
                                        </el-button>
                                    </el-tooltip>
                                </template>
                                <template v-else-if="(scope.row.chargeFlag === '3' && !rowInfo.refundedPerson
                                         ) || scope.row.chargeFlag === '6'">
                                    <el-tooltip class="item" content="撤销退费(单个项目)" effect="dark"
                                                placement="left">
                                        <el-button circle type="danger"
                                                   @click="refundApplicationFun(scope.row.applyItemId, '2', 'single')">
                                            <svg-icon icon-class="refundApplication"/>
                                        </el-button>
                                    </el-tooltip>
                                </template>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
                <span class="ml10 ys-css">-----------------------------------------------------------------------
                ---------------------------------------------------------------</span>
            </template>
        </el-table-column>
        <el-table-column :align="'center'" label="类型" prop="itemClass" width="70">
            <template #default="scope">
                <dict-data-tag :options="dictDataMap['bill_item_class_dict']" :value="scope.row.itemClass"/>
            </template>
        </el-table-column>
        <el-table-column :align="'center'" label="申请单号" min-width="120" prop="applyNo"/>
        <el-table-column :align="'center'" label="结算号" prop="feesNo" width="120"/>
        <!--        <el-table-column :align="'center'" label="缴费标志" prop="chargeFlag" width="130">-->
        <!--            <template #default="scope">-->
        <!--                <dict-data-tag :options="dictDataMap['charge_flag_dict']" :value="scope.row.chargeFlag"/>-->
        <!--            </template>-->
        <!--        </el-table-column>-->
        <el-table-column :align="'center'" label="总费用" prop="charges" width="100">
            <template #default="scope">
                <span class="ys-css">{{ parseFloat(scope.row.charges).toFixed(2) }}</span>元
            </template>
        </el-table-column>
        <el-table-column :align="'center'" label="开单科室" prop="applyDeptName" width="100"/>
        <el-table-column :align="'center'" label="执行科室" prop="implementDeptName" width="100"/>
        <el-table-column :align="'center'" class-name="small-padding fixed-width" fixed="left" label="操作" width="53">
            <template #default="scope">
                <template v-if="scope.row.chargeFlag === '2' && !rowInfo.refundedPerson">
                    <el-tooltip class="item" content="退费申请(申请单)" effect="dark" placement="left">
                        <el-button circle type="warning" @click="refundApplicationFun(scope.row.applyNo, '3', 'apply')">
                            <svg-icon icon-class="refundApplication"/>
                        </el-button>
                    </el-tooltip>
                </template>
                <template
                    v-else-if="(scope.row.chargeFlag === '3' && !rowInfo.refundedPerson) || scope.row.chargeFlag === '6'">
                    <el-tooltip class="item" content="撤销退费(申请单)" effect="dark" placement="left">
                        <el-button circle type="danger" @click="refundApplicationFun(scope.row.applyNo, '2', 'apply')">
                            <svg-icon icon-class="refundApplication"/>
                        </el-button>
                    </el-tooltip>
                </template>
            </template>
        </el-table-column>
    </el-table>
</template>

<script setup lang="ts">
import {listApplyAndDetail, refundApplication} from "@/api/finance/outpFeesMaster.ts";
import {useDictStoreHook} from "@/store/modules/dict";
import {useUserStoreHook} from "@/store/modules/user";

const useUserStore = useUserStoreHook();
const dictStore = useDictStoreHook();
const emits = defineEmits(["getList"]);
const rowInfo = ref<any>({});
const dictDataMap = ref(
    dictStore.isTypeGetData("charge_flag_dict", "sys_yes_no", "bill_item_class_dict", 'grant_flag', 'confirm_flag')
);
// 登录用户信息
const userInfo = <UserInfoBusi>useUserStore.user.userInfo;
const applyList = ref<any>();

function initTableData(row: OutpFeesMaster) {
    listApplyAndDetail({
        feesNo: row.feesNo,
        orgId: userInfo.orgId,
        clinicId: row.clinicId,
        patientId: row.patientId,
    }).then((res: resType) => {
        rowInfo.value = row;
        applyList.value = res.data;
    });
}

function refundApplicationFun(feesOrApplyOrApplyItemId, chargeFlag, type) {
    const typeLabel = chargeFlag === "2" ? "[撤销退费申请]" : "[退费申请]";
    const message = "确定要进行" + typeLabel + "操作吗";
    ElMessageBox.confirm(message, {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
    })
        .then(() => {
            refundApplication(feesOrApplyOrApplyItemId, chargeFlag, type, userInfo.orgId, rowInfo.value.feesNo).then(
                () => {
                    emits("getList");
                }
            );
        })
        .catch(() => {
            ElMessage.info("取消操作");
        });
}

function emptyApplyList() {
    applyList.value = [];
}

defineExpose({
    initTableData,
    emptyApplyList,
});
</script>

<style scoped></style>
